﻿<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <link rel="Shortcut Icon" href="../images/aecc.ico" type="image/x-icon" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="../StaticFiles/element-ui/element-ui.css">
  <link rel="stylesheet" href="../StaticFiles/nprogress/nprogress.min.css">
  <link rel="stylesheet" href="../styles/vue-page-common.css">
  <link rel="stylesheet" href="../styles/table-transparent.css">
  <script src="../Scripts/vue.min.js"></script>
  <script src="../StaticFiles/element-ui/element-ui.js"></script>
  <script src="../Scripts/axios.min.js"></script>
  <script src="../StaticFiles/nprogress/nprogress.min.js"></script>
  <script src="../Scripts/crypto-js.js"></script>
  <script src="../Scripts/secret.js"></script>
  <script src="../Scripts/dayjs.min.js"></script>
  <script src="../Scripts/axios.config.js"></script>
  <script src="../Scripts/datav.min.vue.js"></script>
  <script src="../Scripts/lodash.min.js"></script>
  <title>热表厂生产执行管控看板</title>
  <style>
    html {
      background-image: url(../images/bg.jpg);
      color: #fff;
    }

    .header-title {
      font-size: 24px !important;
    }

    .el-form-item__label {
      color: #fff;
    }

    .el-form-item {
      margin-bottom: 0px;
    }

    .chart-title {
      text-align: center;
      padding-top: 10px;
      font-size: 20px;
      font-weight: bold;
      color: #fff;
    }

    .chart {
      width: 100%;
      font-size: 40px;
      font-weight: bold;
      cursor: pointer;
      text-align: center;
    }

    .step-cell {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      /* height: 80px; */
    }

    .pattern-container {
      display: flex;
      align-items: center;
      justify-content: center;
      /* margin-top: 5px; */
    }

    .connection-line {
      height: 24px;
    }

    .step-icon {
      z-index: 10;
    }

    .icon-lable {
      margin: 0 5px;
      font-size: 13px;
    }

    #datagrid .el-table__row .el-table__cell {
      padding: 6px 0;
    }
  </style>
</head>

<body>
  <div id="app" v-cloak>
    <div style="padding:0 5px;">
      <!-- 看板标题组件 -->
      <vue2-board-header :title="'热表厂生产执行管控看板'"></vue2-board-header>
      <el-form :inline="true" :model="queryInfo" ref="queryInfoRef" :label-position="'left'" :rules="rules"
        id="queryInfo" style="margin:10px">
        <el-form-item label="年月:" prop="yearmonth">
          <el-date-picker v-model="queryInfo.yearmonth" type="month" value-format="yyyy-MM" style="width: 120px;"
            @change="selectYearMonthChange">
          </el-date-picker>
        </el-form-item>

        <el-form-item label="组织架构:" prop="selectOrg">
          <el-cascader :options="orginazition" :props="{ checkStrictly: true}" ref="orginazitionRef"
            v-model="queryInfo.selectOrg" style="width:340px;">
          </el-cascader>
        </el-form-item>

        <el-form-item prop='productname' label="零件图号:">
          <el-autocomplete v-model.trim="queryInfo.productname" placeholder="请输入零件图号" :trigger-on-focus="false"
            style="width:300px;" :fetch-suggestions="searchProductAsync" :value-key="'productname'" :debounce="500">
          </el-autocomplete>
        </el-form-item>

        <el-form-item prop='containername' label="批次号:">
          <el-autocomplete v-model.trim="queryInfo.containername" placeholder="请输入批次号" :trigger-on-focus="false"
            style="width:360px;" :fetch-suggestions="searchContainerAsync" :value-key="'containername'" :debounce="500">
          </el-autocomplete>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="small" @click="handleBtnSearch">查询</el-button>
        </el-form-item>
      </el-form>

      <el-row :gutter="10" style="margin:5px;margin-bottom: 0px;">
        <el-col :span="4">
          <dv-border-box-10 style="margin-bottom: 10px;">
            <div class="chart-title">转工管理</div>
            <div id="shipChart" class="chart" :style="{ height: 240 +'px' }"></div>
          </dv-border-box-10>

          <dv-border-box-10>
            <div class="chart-title">排产管理</div>
            <div id="apsChart" class="chart" :style="{ height: 240 +'px' }"></div>
          </dv-border-box-10>
        </el-col>

        <el-col :span="16">
          <dv-border-box-10>
            <el-row>
              <el-col :span="8">
                <div style="display: flex; align-items: center;margin:10px 0 0 10px;">
                  <svg class="step-icon" width="24" height="24" viewBox="0 0 24 24">
                    <circle cx="12" cy="12" r="10" fill="#FFF" stroke="#FFF" stroke-width="2" />
                  </svg>
                  <span class="icon-lable">未派工</span>

                  <svg class="step-icon" width="24" height="24" viewBox="0 0 24 24">
                    <circle cx="12" cy="12" r="10" fill="#ff9f19" stroke="#ff9f19" stroke-width="2" />
                  </svg>
                  <span class="icon-lable">已派工</span>

                  <svg class="step-icon" width="24" height="24" viewBox="0 0 24 24">
                    <circle cx="12" cy="12" r="10" fill="#29ced6" stroke="#29ced6" stroke-width="2" />
                  </svg>
                  <span class="icon-lable">已报工</span>

                  <svg class="step-icon" width="24" height="24" viewBox="0 0 24 24">
                    <circle cx="12" cy="12" r="10" fill="#0fd850" stroke="#0fd850" stroke-width="2" />
                  </svg>
                  <span class="icon-lable">已检验</span>
                </div>
              </el-col>
              <el-col :span="8">
                <div class="chart-title">批次加工进度</div>
              </el-col>
              <el-col :span="8">

              </el-col>
            </el-row>

            <div id="datagrid" style="height: 506px;padding:10px;">
              <el-table :data="dataList" border style="width: 100%;margin-bottom: 10px;" height="470" ref="table">
                <el-table-column prop="containername" label="批次号" align="center"></el-table-column>
                <el-table-column prop="workflowstepname" width="180" show-overflow-tooltip label="工序" align="center">
                </el-table-column>
                <!-- 查询时取出最大的工序数 -->
                <el-table-column align="center" width="160" :resizable="false" v-for="index in maxSeq" :key="index"
                  :label="`${index}-工步`">
                  <template slot-scope="scope">
                    <div class="step-cell">
                      <span v-if="scope.row.steps[index-1]">
                        {{scope.row.steps[index-1].stepno}}
                      </span>
                      <div class="pattern-container" v-if="scope.row.steps[index-1]">
                        <!-- 左侧连接线 -->
                        <svg class="connection-line" width="120" height="36" viewBox="0 0 120 24">
                          <line x1="0" y1="12" x2="200" y2="12" stroke="#fff" stroke-width="2" stroke-dasharray="6,2" />
                        </svg>

                        <svg class="step-icon" width="24" height="24" viewBox="0 0 24 24" style="cursor:pointer;"
                          @click="nodeClick(scope.row,index-1)">
                          <circle cx="12" cy="12" r="10" :fill="getStatusColor(scope.row.steps[index-1].status)"
                            :stroke="getStatusColor(scope.row.steps[index-1].status)" stroke-width="2" />
                        </svg>

                        <!-- 右侧连接线 -->
                        <svg class="connection-line" width="120" height="24" viewBox="0 0 120 24">
                          <line x1="0" y1="12" x2="200" y2="12" stroke="#fff" stroke-width="2" stroke-dasharray="6,2" />
                        </svg>
                      </div>

                      <span v-if="scope.row.steps[index-1]">
                        {{scope.row.steps[index-1].notes.length >= 8 ?
                        scope.row.steps[index-1].notes.substring(0,7)+'...':scope.row.steps[index-1].notes}}
                      </span>
                    </div>
                  </template>
                </el-table-column>
              </el-table>
              <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                :current-page="queryInfo.currentPage" :page-sizes="[5,20,50,100]" :page-size="queryInfo.pageSize"
                layout="prev,pager,next,jumper,sizes,total" :total="total">
              </el-pagination>
            </div>
          </dv-border-box-10>
        </el-col>

        <el-col :span="4">
          <dv-border-box-10 style="margin-bottom: 10px;">
            <div class="chart-title">问题快反</div>
            <div id="feedbackChart" class="chart" :style="{ height: 240 +'px' }"></div>
          </dv-border-box-10>

          <dv-border-box-10>
            <div class="chart-title">理化管理</div>
            <div id="physicalChart" class="chart" :style="{ height: 240 +'px' }"></div>
          </dv-border-box-10>
        </el-col>
      </el-row>

      <el-row style="margin:10px;">
        <el-col :span="24">
          <dv-border-box-10>
            <div class="chart-title">月度加工情况统计</div>
            <div id="lineChart" class="chart" :style="{ height: chartHeight +'px' }"></div>
          </dv-border-box-10>
        </el-col>
      </el-row>

      <!-- 工序明细对话框 -->
      <el-dialog :title="detail.title" :width="'98%'" :top="'10px'" :center="true" :visible.sync="detail.dialogVisiable"
        @close="dialogClosed">
        <!-- 批次基本信息 -->
        <el-descriptions title="批次基本信息" border :column="5" style="margin-bottom: 10px;">
          <el-descriptions-item label="流水卡号">
            <el-tag>{{detail.selecteSpecInfo.containername}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="当前工艺名称">
            <el-tag>{{detail.selecteSpecInfo.workflowname}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="当前工艺版本">
            <el-tag>{{detail.selecteSpecInfo.workflowrevision}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="零件图号">
            <el-tag>{{detail.selecteSpecInfo.productname}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="零件名称">
            <el-tag>{{detail.selecteSpecInfo.productdescription}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="在制数">
            <el-tag>{{detail.selecteSpecInfo.qty}}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="当前工序">
            <el-tag v-if="detail.selecteSpecInfo.workflowstepname">{{detail.selecteSpecInfo.workflowstepname}}</el-tag>
          </el-descriptions-item>
        </el-descriptions>
        <!-- tabs选项卡 -->
        <el-tabs v-model="activeName" @tab-click="tabSelectChange">
          <el-tab-pane label="工步加工信息" name="stepInfo">
            <!-- 工步加工信息 -->
            <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
              element-loading-background="rgba(0,0,0,0.8)" :data="detail.stepInfoList" stripe border height="400">
              <el-table-column type="index" width="50"></el-table-column>
              <el-table-column label="工步号" prop="stepno" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="工步" prop="stepinfodesc" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="派工时间" prop="dispatchdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="派工人" prop="dispatchfullname" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="派工数" prop="dispatchqty" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="加工设备" prop="resourcedesc" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="派给工人" prop="dispatchworkname" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="报工时间" prop="reportdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="报工人" prop="reportemployeename" width="100" show-overflow-tooltip>
              </el-table-column>
              <el-table-column label="加工班组" prop="teamname" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="报工数" prop="reportqty" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="检验人" prop="checkemployeename" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="检验时间" prop="checkdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="合格数" prop="passqty" width="100" show-overflow-tooltip></el-table-column>
              <el-table-column label="报废数" prop="lossqty" width="100" show-overflow-tooltip></el-table-column>
            </el-table>
          </el-tab-pane>

          <el-tab-pane label="检测项信息" name="checkPointResultInfo">
            <!-- 检测项信息 -->
            <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
              element-loading-background="rgba(0,0,0,0.8)" :data="detail.checkPointResultInfoList" stripe border
              height="400">
              <el-table-column type="index" width="50"></el-table-column>
              <el-table-column label="关键特性标识" prop="name" width="200" show-overflow-tooltip></el-table-column>
              <el-table-column label="检测项内容" prop="checkpointnotedis_b" width="120" show-overflow-tooltip>
                <template slot-scope="scope" v-if="scope.row.checkpointnotedis_b">
                  <div v-html="scope.row.checkpointnotedis_b"></div>
                </template>
              </el-table-column>
              <el-table-column label="关键过程检" prop="keycheckname" width="120" show-overflow-tooltip></el-table-column>
              <el-table-column label="工序检" prop="meopcheckname" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="质保单" prop="qualitycheckname" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="操作者" prop="workername" width="80" show-overflow-tooltip></el-table-column>
              <el-table-column label="操作时间" prop="createdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="检验者" prop="checkername" width="120" show-overflow-tooltip></el-table-column>
              <el-table-column label="图纸规定" prop="drawingrequiredis_b" show-overflow-tooltip>
                <template slot-scope="scope" v-if="scope.row.drawingrequiredis_b">
                  <div v-html="scope.row.drawingrequiredis_b"></div>
                </template>
              </el-table-column>
              <el-table-column label="工人检测值" prop="workcheckpointresultnotedis_b" show-overflow-tooltip>
                <template slot-scope="scope" v-if="scope.row.workcheckpointresultnotedis_b">
                  <div v-html="scope.row.workcheckpointresultnotedis_b"></div>
                </template>
              </el-table-column>
              <el-table-column label="检验检测值" prop="checkpointresultnotedis_b" show-overflow-tooltip>
                <template slot-scope="scope" v-if="scope.row.checkpointresultnotedis_b">
                  <div v-html="scope.row.checkpointresultnotedis_b"></div>
                </template>
              </el-table-column>
              <el-table-column label="检测时间" prop="checkdate" width="160" :formatter="replaceDate"></el-table-column>
              <el-table-column label="子序号" prop="containername" width="120" show-overflow-tooltip></el-table-column>
            </el-table>
          </el-tab-pane>
        </el-tabs>
      </el-dialog>

      <!-- 转工管理钻取对话框 -->
      <el-dialog :title="shipChartDetail.queryInfo.title" :width="'98%'" :top="'10px'" :center="'center'"
        :visible.sync="shipChartDetail.dialogVisiable">
        <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
          element-loading-background="rgba(0,0,0,0.8)" :data="shipChartDetail.dataList" stripe border>
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column label="主制厂" prop="factoryname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="承制厂" prop="tofactoryname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="工区" prop="workcentername" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="型别" prop="familylistnames" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="零件号" prop="productname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="零件名称" prop="productdescription" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="批次号" prop="containername" show-overflow-tooltip></el-table-column>
          <el-table-column label="数量" prop="qty" width="80" show-overflow-tooltip></el-table-column>
          <el-table-column label="转出工序" prop="workflowstepname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="转出时间" prop="senddate" width="170" :formatter="replaceDate" show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="要求完成时间" prop="needcompletedate" :formatter="splitDate" width="100"
            show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="接收人" prop="fullname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="接收时间" prop="toacceptdate" width="170" :formatter="replaceDate" show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="状态" prop="status" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="操作" width="100">
            <template slot-scope="scope">
              <el-button type="primary" icon="el-icon-download" size="mini" @click="exportShipRateData">导出
              </el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination @current-change="handleShipDetailCurrentChange"
          :current-page="shipChartDetail.queryInfo.currentPage" :page-sizes="[shipChartDetail.queryInfo.pageSize]"
          :page-size="shipChartDetail.queryInfo.pageSize" layout="prev,pager,next,jumper,sizes,total"
          :total="shipChartDetail.total">
        </el-pagination>
      </el-dialog>

      <!-- 排产管理钻取对话框 -->
      <el-dialog :title="apsChartDetail.queryInfo.title" :width="'98%'" :top="'10px'" :center="'center'"
        :visible.sync="apsChartDetail.dialogVisiable">
        <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
          element-loading-background="rgba(0,0,0,0.8)" :data="apsChartDetail.dataList" stripe border>
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column label="订单号" prop="mfgordername" width="120" show-overflow-tooltip></el-table-column>
          <el-table-column label="批次号" prop="containername" show-overflow-tooltip></el-table-column>
          <el-table-column label="数量" prop="qty" width="60" show-overflow-tooltip></el-table-column>
          <el-table-column label="当前工序" prop="currentspec" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="工步号" prop="stepno" width="60" show-overflow-tooltip></el-table-column>
          <el-table-column label="工步名称" prop="description" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="排产工艺信息" prop="workflowinfo" width="160" show-overflow-tooltip></el-table-column>
          <el-table-column label="主卡批次" prop="togetherflag" width="180" show-overflow-tooltip></el-table-column>
          <el-table-column label="计划开始时间" prop="starttime" width="170" :formatter="replaceDate" show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="计划结束时间" prop="endtime" width="170" show-overflow-tooltip :formatter="replaceDate">
          </el-table-column>
          <el-table-column label="工区" prop="workcentername" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="班组" prop="teamname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="操作" width="100">
            <template slot-scope="scope">
              <el-button type="primary" icon="el-icon-download" size="mini" @click="exportApsRateData">导出
              </el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination @current-change="handleApsDetailCurrentChange"
          :current-page="apsChartDetail.queryInfo.currentPage" :page-sizes="[apsChartDetail.queryInfo.pageSize]"
          :page-size="apsChartDetail.queryInfo.pageSize" layout="prev,pager,next,jumper,sizes,total"
          :total="apsChartDetail.total">
        </el-pagination>
      </el-dialog>

      <!-- 问题快反钻取对话框 -->
      <el-dialog :title="feedbackChartDetail.queryInfo.title" :width="'98%'" :top="'10px'" :center="'center'"
        :visible.sync="feedbackChartDetail.dialogVisiable">
        <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
          element-loading-background="rgba(0,0,0,0.8)" :data="feedbackChartDetail.dataList" stripe border>
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column label="问题类型" prop="problemtype" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="提出人" prop="username" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="提出单位" prop="departmentname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="提出时间" prop="createdate" width="170" :formatter="replaceDate" show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="问题描述" prop="problem_feedback_title" show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="状态" prop="status" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="操作" width="100">
            <template slot-scope="scope">
              <el-button type="primary" icon="el-icon-download" size="mini" @click="exportFeedbackRateData">导出
              </el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination @current-change="handleFeedbackDetailCurrentChange"
          :current-page="feedbackChartDetail.queryInfo.currentPage"
          :page-sizes="[feedbackChartDetail.queryInfo.pageSize]" :page-size="feedbackChartDetail.queryInfo.pageSize"
          layout="prev,pager,next,jumper,sizes,total" :total="feedbackChartDetail.total">
        </el-pagination>
      </el-dialog>

      <!-- 理化管理钻取对话框 -->
      <el-dialog :title="phyChartDetail.queryInfo.title" :width="'98%'" :top="'10px'" :center="'center'"
        :visible.sync="phyChartDetail.dialogVisiable">
        <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
          element-loading-background="rgba(0,0,0,0.8)" :data="phyChartDetail.dataList" stripe border>
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column label="订单号" prop="mfgordername" width="120" show-overflow-tooltip></el-table-column>
          <el-table-column label="零件号" prop="productname" width="140" show-overflow-tooltip></el-table-column>
          <el-table-column label="零件名称" prop="productdescription" width="140" show-overflow-tooltip></el-table-column>
          <el-table-column label="批次号" prop="containername" show-overflow-tooltip></el-table-column>
          <el-table-column label="委托数量" prop="entrustqty" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="委托人" prop="fullname" width="80" show-overflow-tooltip></el-table-column>
          <el-table-column label="申请时间" prop="createdate" width="170" :formatter="replaceDate" show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="状态" prop="status" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="操作" width="100">
            <template slot-scope="scope">
              <el-button type="primary" icon="el-icon-download" size="mini" @click="exportPhyRateData">导出
              </el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination @current-change="handleFeedbackDetailCurrentChange"
          :current-page="phyChartDetail.queryInfo.currentPage" :page-sizes="[phyChartDetail.queryInfo.pageSize]"
          :page-size="phyChartDetail.queryInfo.pageSize" layout="prev,pager,next,jumper,sizes,total"
          :total="phyChartDetail.total">
        </el-pagination>
      </el-dialog>

      <!-- 月度加工情况统计钻取对话框 -->
      <el-dialog :title="monthProcessChartDetail.queryInfo.title" :width="'98%'" :top="'10px'" :center="'center'"
        :visible.sync="monthProcessChartDetail.dialogVisiable">
        <el-table v-loading="loading" v-loading.fullscreen.lock="loading" :element-loading-text="loadingText"
          element-loading-background="rgba(0,0,0,0.8)" :data="monthProcessChartDetail.dataList" stripe border>
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column label="主制分厂" prop="fromfactoryname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="承制分厂" prop="tofactoryname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="工区" prop="workcentername" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="班组" prop="teamname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="主卡流水卡号" prop="pcontainername" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="主卡工序" prop="pworkflowstepname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="热表批次号" prop="rbcontainername" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="热表工序" prop="sworkflowstepname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="数量" prop="qty" width="60" show-overflow-tooltip></el-table-column>
          <el-table-column label="零件图号" prop="productname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="零件名称" prop="productdescription" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="加工开始时间" prop="starttime" width="160" :formatter='replaceDate'></el-table-column>
          <el-table-column label="加工结束时间" prop="endtime" width="160" :formatter='replaceDate'></el-table-column>
          <el-table-column label="转工发出时间" prop="senddate" width="160" :formatter='replaceDate'></el-table-column>
          <el-table-column label="转工接收时间" prop="toacceptdate" width="160" :formatter='replaceDate'></el-table-column>
          <el-table-column label="转工接收人" prop="acceptorname" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="状态" prop="status" width="80"></el-table-column>
          <el-table-column label="操作" width="100">
            <template slot-scope="scope">
              <el-button type="primary" icon="el-icon-download" size="mini" @click="exportMonthProcessData">导出
              </el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination @current-change="handleMonthProcessChartDetailCurrentChange"
          :current-page="monthProcessChartDetail.queryInfo.currentPage"
          :page-sizes="[monthProcessChartDetail.queryInfo.pageSize]"
          :page-size="monthProcessChartDetail.queryInfo.pageSize" layout="prev,pager,next,jumper,sizes,total"
          :total="monthProcessChartDetail.total">
        </el-pagination>
      </el-dialog>
    </div>
  </div>

  <script src="../Scripts/echarts/echarts-5.4.0.min.js"></script>
  <script src="../Scripts/echarts/echarts-liquidfill.min.js"></script>

  <script type="module">
    import Vue2BoardHeader from '../Scripts/components/Vue2BoardHeader.js'
    import { barOption, colorList } from '../Scripts/hooks/chartConfig.js'
    import { exportExcelData, getParams, fetchSuggestion } from '../Scripts/hooks/useCommonMethod.js'
    import { prevWeek, thisWeek, nextWeek, prevMonth, thisMonth, nextMonth } from '../Scripts/hooks/useDateShortCut.js'
    import { getUserInfo, getFactory } from '../Scripts/hooks/fetchAPI.js'
    import { splitDate, replaceDate } from '../Scripts/hooks/format.js'
    import { getMESOrginazition, getFactoryInfo } from '../Scripts/hooks/fetchAPI.js'
    import { pieOption } from '../Scripts/hooks/pieChartConfig.js'
    const app = new Vue({
      el: '#app',
      components: { Vue2BoardHeader },
      data: {
        splitDate, replaceDate,
        total: 0,
        loading: false,
        loadingText: '数据加载中...',
        queryInfo: {
          yearmonth: '', startOfSelectMonth: '', endOfSelectMonth: '',
          selectOrg: '',
          productname: '',
          containername: '',
          currentPage: 1,//当前页
          pageSize: 5//每页显示条数
        },
        rules: {
          yearmonth: [
            { required: true, message: '【年月】不能为空', trigger: 'change' }
          ],
        },
        pickerOptions: { shortcuts: [prevWeek, thisWeek, nextWeek, prevMonth, thisMonth, nextMonth] },
        orginazition: [],
        dataList: [],
        maxSeq: 0,
        baseApi: '../handler/board/RbProductExecuteDashBoard.ashx',
        loadingConfig: { text: '数据查询中...', effect: 'whirling', maskColor: 'transparent', textColor: '#fff' },
        chartHeight: window.innerHeight - 740,
        shipChartDetail: {
          dialogVisiable: false,
          queryInfo: { seriesName: '', title: '', currentPage: 1, pageSize: 12 },
          dataList: [],
          total: 0
        },
        apsChartDetail: {
          dialogVisiable: false,
          queryInfo: { seriesName: '', title: '', currentPage: 1, pageSize: 12 },
          dataList: [],
          total: 0
        },
        feedbackChartDetail: {
          dialogVisiable: false,
          queryInfo: { seriesName: '', title: '', currentPage: 1, pageSize: 12 },
          dataList: [],
          total: 0
        },
        phyChartDetail: {
          dialogVisiable: false,
          queryInfo: { seriesName: '', title: '', currentPage: 1, pageSize: 12 },
          dataList: [],
          total: 0
        },
        monthProcessChartDetail: {
          dialogVisiable: false,
          queryInfo: { seriesName: '', endtime: '', title: '', currentPage: 1, pageSize: 12 },
          dataList: [],
          total: 0
        },
        // 批次各工序详细信息
        detail: {
          dialogVisiable: false, title: '',
          queryInfo: { containerid: '', workflowstepid: '', stepinfoid: '' },
          selecteSpecInfo: {},
          checkPointResultInfoList: [],//检测项
          stepInfoList: [],//工步加工信息
        },
        activeName: 'stepInfo'
      },
      methods: {
        // 查询件号
        searchProductAsync(value, callback) {
          fetchSuggestion({ actionName: 'getProductnameAsync', name: 'productname', value: value.trim(), callback });
        },
        // 查询批次号
        async searchContainerAsync(value, callback) {
          fetchSuggestion({ actionName: 'getContainernameAsync', name: 'containername', value: value.trim(), callback });
        },
        // 转工管理
        async getShipRateData() {
          const dom = document.getElementById('shipChart');
          echarts.dispose(dom);
          let chart = echarts.init(dom);
          chart.showLoading(this.loadingConfig);

          const { data: { data, meta, total } } = await axios.post(`${this.baseApi}?action=getShipRateData`, {
            type: 'getShipRateData',
            ...this.queryInfo
          })

          chart.hideLoading();

          if (meta.status === 500) { return this.$message.error(meta.msg); }
          if (data.length === 0) { return; }

          const { finishcount, unfinishcount, finishrate } = data[0];
          echarts.dispose(dom);
          chart = echarts.init(dom);

          const pieData = [{ value: finishcount, name: '已完成' }, { value: unfinishcount, name: '未完成' }];

          let option = pieOption({ data: pieData });
          option.color = ['#a6e35a', '#ff0844'];
          option.legend = { ...option.legend, x: '10', y: '10', textStyle: { color: '#FFF' } };
          option.series[0].label.formatter = '{c}';
          option.series[0].center = ['50%', '55%'];
          chart.setOption(option);

          chart.on('click', (params) => {
            const { seriesName, name, value } = params;
            if (name === '已完成') { return this.$message.error('转工【已完成】数据不可数据钻取'); }

            if (value === 0) { return; }
            this.shipChartDetail.queryInfo.seriesName = '未完成';
            this.shipChartDetail.queryInfo.currentPage = 1;
            this.shipChartDetail.queryInfo.title = `转工未完成任务明细`;
            this.shipChartDetail.dialogVisiable = true;
            this.getShipRateDetails();
          })
        },
        // 转工管理明细钻取
        async getShipRateDetails() {
          this.loading = true;
          this.loadingText = '数据加载中...';
          const { data: { data, meta, total } } = await axios.post(`${this.baseApi}?action=getShipRateDetails`, {
            type: 'getShipRateDetails',
            ...this.queryInfo,
            ...this.shipChartDetail.queryInfo
          })
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.shipChartDetail.dataList = data;
          this.shipChartDetail.total = total;
        },
        // 转工管理明细导出
        async exportShipRateData() {
          this.$refs['queryInfoRef'].validate(async (valid) => {
            if (valid) {
              const config = {
                url: `${this.baseApi}?action=exportShipRateData`,
                data: { type: 'exportShipRateData', ...this.queryInfo, seriesName: '未完成' }
              }
              exportExcelData(config, this);
            }
          })
        },
        // 排产管理
        async getApsRateData() {
          const dom = document.getElementById('apsChart');
          echarts.dispose(dom);
          let chart = echarts.init(dom);
          chart.showLoading(this.loadingConfig);

          const { data: { data, meta, total } } = await axios.post(`${this.baseApi}?action=getApsRateData`, {
            type: 'getApsRateData',
            ...this.queryInfo
          })

          chart.hideLoading();

          if (meta.status === 500) { return this.$message.error(meta.msg); }
          if (data.length === 0) { return; }

          const { finishrate, finishcount, unfinishcount } = data[0];
          echarts.dispose(dom);
          chart = echarts.init(dom);

          const pieData = [{ value: finishcount, name: '已下发' }, { value: unfinishcount, name: '未下发' }];

          let option = pieOption({ data: pieData });
          option.color = ['#a6e35a', '#ff0844'];
          option.legend = { ...option.legend, x: '10', y: '10', textStyle: { color: '#FFF' } };
          option.series[0].label.formatter = '{c}';
          option.series[0].center = ['50%', '55%'];
          chart.setOption(option);

          chart.on('click', (params) => {
            const { seriesName, name, value } = params;
            if (name === '已下发') { return this.$message.error('排产【已下发】数据不可数据钻取'); }
            if (value === 0) { return; }
            this.apsChartDetail.queryInfo.seriesName = '未下发';
            this.apsChartDetail.queryInfo.currentPage = 1;
            this.apsChartDetail.queryInfo.title = `未下发任务明细`;
            this.apsChartDetail.dialogVisiable = true;
            this.getApsRateDetails();
          })
        },
        // 排产管理明细
        async getApsRateDetails() {
          this.loading = true;
          this.loadingText = '数据加载中...';
          const { data: { data, meta, total } } = await axios.post(`${this.baseApi}?action=getApsRateDetails`, {
            type: 'getApsRateDetails',
            ...this.queryInfo,
            ...this.apsChartDetail.queryInfo
          })
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.apsChartDetail.dataList = data;
          this.apsChartDetail.total = total;
        },
        // 排产管理明细导出
        exportApsRateData() {
          this.$refs['queryInfoRef'].validate(async (valid) => {
            if (valid) {
              const config = {
                url: `${this.baseApi}?action=exportApsRateData`,
                data: { type: 'exportApsRateData', ...this.queryInfo, seriesName: '未完成' }
              }
              exportExcelData(config, this);
            }
          })
        },
        // 问题快反
        async getFeedbackRateData() {
          const dom = document.getElementById('feedbackChart');
          echarts.dispose(dom);
          let chart = echarts.init(dom);
          chart.showLoading(this.loadingConfig);

          const { data: { data, meta, total } } = await axios.post(`${this.baseApi}?action=getFeedbackRateData`, {
            type: 'getFeedbackRateData',
            ...this.queryInfo
          })

          chart.hideLoading();

          if (meta.status === 500) { return this.$message.error(meta.msg); }
          if (data.length === 0) { return; }

          const { finishrate } = data[0];
          echarts.dispose(dom);
          chart = echarts.init(dom);

          const option = this.initWaterPoloChart(finishrate, '#a6e35a');

          chart.setOption(option);
          chart.on('click', (params) => {
            const { seriesName, name, value } = params;
            if (value === 1) { return; }
            this.feedbackChartDetail.queryInfo.seriesName = '未完成';
            this.feedbackChartDetail.queryInfo.currentPage = 1;
            this.feedbackChartDetail.queryInfo.title = `未关闭快反问题明细`;
            this.feedbackChartDetail.dialogVisiable = true;
            this.getFeedbackRateDetails();
          })
        },
        // 问题快反明细
        async getFeedbackRateDetails() {
          this.loading = true;
          this.loadingText = '数据加载中...';
          const { data: { data, meta, total } } = await axios.post(`${this.baseApi}?action=getFeedbackRateDetails`, {
            type: 'getFeedbackRateDetails',
            ...this.queryInfo,
            ...this.feedbackChartDetail.queryInfo
          })
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.feedbackChartDetail.dataList = data;
          this.feedbackChartDetail.total = total;
        },
        // 问题快反明细导出
        exportFeedbackRateData() {
          this.$refs['queryInfoRef'].validate(async (valid) => {
            if (valid) {
              const config = {
                url: `${this.baseApi}?action=exportFeedbackRateData`,
                data: { type: 'exportFeedbackRateData', ...this.queryInfo, seriesName: '未完成' }
              }
              exportExcelData(config, this);
            }
          })
        },
        // 理化管理
        async getPhyRateData() {
          const dom = document.getElementById('physicalChart');
          echarts.dispose(dom);
          let chart = echarts.init(dom);
          chart.showLoading(this.loadingConfig);

          const { data: { data, meta, total } } = await axios.post(`${this.baseApi}?action=getPhyRateData`, {
            type: 'getPhyRateData',
            ...this.queryInfo
          })

          chart.hideLoading();

          if (meta.status === 500) { return this.$message.error(meta.msg); }
          if (data.length === 0) { return; }

          const { finishrate } = data[0];
          echarts.dispose(dom);
          chart = echarts.init(dom);

          const option = this.initWaterPoloChart(finishrate, '#a6e35a');

          chart.setOption(option);
          chart.on('click', (params) => {
            const { seriesName, name, value } = params;
            if (value === 1) { return; }
            this.phyChartDetail.queryInfo.seriesName = '未完成';
            this.phyChartDetail.queryInfo.currentPage = 1;
            this.phyChartDetail.queryInfo.title = `未完成理化明细`;
            this.phyChartDetail.dialogVisiable = true;
            this.getPhyRateDetails();
          })
        },
        // 理化管理明细
        async getPhyRateDetails() {
          this.loading = true;
          this.loadingText = '数据加载中...';
          const { data: { data, meta, total } } = await axios.post(`${this.baseApi}?action=getPhyRateDetails`, {
            type: 'getPhyRateDetails',
            ...this.queryInfo,
            ...this.phyChartDetail.queryInfo
          })
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.phyChartDetail.dataList = data;
          this.phyChartDetail.total = total;
        },
        // 理化管理明细导出
        exportPhyRateData() {
          this.$refs['queryInfoRef'].validate(async (valid) => {
            if (valid) {
              const config = {
                url: `${this.baseApi}?action=exportPhyRateData`,
                data: { type: 'exportPhyRateData', ...this.queryInfo, seriesName: '未完成' }
              }
              exportExcelData(config, this);
            }
          })
        },
        // 批次加工进度
        async getStepProcessInfo() {
          const { data: { data, meta, total } } = await axios.post(`${this.baseApi}?action=getStepProcessInfo`, {
            type: 'getStepProcessInfo',
            ...this.queryInfo
          })
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.dataList = data;
          this.total = total;
          if (data.length > 0) {
            this.maxSeq = Math.max(...data.map(item => item.maxseq));
            setTimeout(() => { this.$refs["table"].doLayout(); }, 100);
          }
        },
        // 月度加工情况统计
        async getMonthProcessData() {
          const dom = document.getElementById('lineChart');
          echarts.dispose(dom);
          let chart = echarts.init(dom);
          chart.showLoading(this.loadingConfig);

          const { data: { data, meta, total } } = await axios.post(`${this.baseApi}?action=getMonthProcessData`, {
            type: 'getMonthProcessData',
            ...this.queryInfo
          })

          chart.hideLoading();

          if (meta.status === 500) { return this.$message.error(meta.msg); }
          if (data.length === 0) { return; }

          const arrDay = [], arrFinishRate = [];

          for (const i of data) {
            arrDay.push(i.monthdate.split('T')[0]);//x轴文字
            arrFinishRate.push(i.finishrate);
          }

          let option = barOption();
          option.legend.data = ['完成率'];
          option.yAxis[0].axisLabel.formatter = function (data) { return data + "%"; };
          option.xAxis.data = arrDay;
          option.xAxis.axisLabel.formatter = function (data) { return data.split('-')[2] }

          option.series[0] = _.merge(_.cloneDeep(option.series[0]), {
            name: '完成率',
            data: arrFinishRate,
            type: 'line',
            symbolSize: 10,
            smooth: true,
            label: { color: colorList.green.color, formatter: '{c}%' },
            lineStyle: { width: 3, color: colorList.green.color },
            itemStyle: { color: { colorStops: colorList.green.colorStops } }
          });

          chart.setOption(option);
          window.addEventListener('resize', () => {
            chart.resize();
          });

          chart.on('click', (params) => {
            const { seriesName, name, value } = params;
            if (value === 100) { return; }
            this.monthProcessChartDetail.queryInfo.seriesName = '未完成';
            this.monthProcessChartDetail.queryInfo.endtime = name;
            this.monthProcessChartDetail.queryInfo.currentPage = 1;
            this.monthProcessChartDetail.queryInfo.title = `未完成任务明细`;
            this.monthProcessChartDetail.dialogVisiable = true;
            this.getMonthProcessDetails();
          })
        },
        // 月度加工情况统计钻取
        async getMonthProcessDetails() {
          this.loading = true;
          this.loadingText = '数据加载中...';
          const { data: { data, meta, total } } = await axios.post(`${this.baseApi}?action=getMonthProcessDetails`, {
            type: 'getMonthProcessDetails',
            ...this.queryInfo,
            ...this.monthProcessChartDetail.queryInfo
          })
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.monthProcessChartDetail.dataList = data;
          this.monthProcessChartDetail.total = total;
        },
        // 月度加工情况明细导出
        async exportMonthProcessData() {
          this.$refs['queryInfoRef'].validate(async (valid) => {
            if (valid) {
              const config = {
                url: `${this.baseApi}?action=exportMonthProcessData`,
                data: { type: 'exportMonthProcessData', ...this.queryInfo, seriesName: '未完成' }
              }
              exportExcelData(config, this);
            }
          })
        },
        // 初始化水球图配置
        initWaterPoloChart(value, color) {
          return {
            series: [{
              type: 'liquidFill',
              data: [value],
              radius: '80%',
              center: ['50%', '50%'],
              amplitude: '5%',
              waveLength: '60%',
              period: 2000,//波动频率
              waveAnimation: true,
              animationDuration: 1000,
              animationEasing: 'elasticOut',
              color: [color],
              backgroundStyle: {
                color: 'rgba(255, 255, 255, 0.1)',
                borderWidth: 0
              },
              outline: {
                show: true,
                borderDistance: 0,
                itemStyle: {
                  borderColor: color,
                  borderWidth: 2,
                  shadowBlur: 4,
                  shadowColor: color,
                  opacity: 0.5
                }
              },
              label: {
                normal: {
                  fontSize: 40,
                  fontWeight: 'bold',
                  color: color,
                  textShadowBlur: 2,
                  textShadowColor: 'rgba(0, 0, 0, 0.3)',
                  formatter: function (value) {
                    if (value.data === null) {
                      return '无数据';
                    } else {
                      return Number.isInteger(value.data * 100)
                        ? `${value.data * 100}%`
                        : `${(value.data * 100).toFixed(2)}%`
                    }
                  }
                }
              }
            }]
          }
        },
        // 根据状态获取对应的颜色
        getStatusColor(status) {
          const colorMap = {
            '未派工': '#FFF',
            '已派工': '#ff9f19',
            '已报工': '#29ced6',
            '已检验': '#0fd850',
          };
          return colorMap[status] || '#FFF';
        },
        // 批次加工进度分页
        handleCurrentChange(newPage) {
          this.queryInfo.currentPage = newPage;
          this.getStepProcessInfo();
        },
        // 批次加工进度 每页显示条数变更
        handleSizeChange(pageSize) {
          this.queryInfo.pageSize = pageSize;
          this.getStepProcessInfo();
        },
        // 转工管理钻取分页
        handleShipDetailCurrentChange(newPage) {
          this.shipChartDetail.queryInfo.currentPage = newPage;
          this.getShipRateDetails();
        },
        // 排产管理钻取分页
        handleApsDetailCurrentChange(newPage) {
          this.apsChartDetail.queryInfo.currentPage = newPage;
          this.getApsRateDetails();
        },
        // 问题快反钻取分页
        handleFeedbackDetailCurrentChange(newPage) {
          this.feedbackChartDetail.queryInfo.currentPage = newPage;
          this.getFeedbackRateDetails();
        },
        // 理化管理钻取分页
        handlePhyDetailCurrentChange(newPage) {
          this.phyChartDetail.queryInfo.currentPage = newPage;
          this.getPhyRateDetails();
        },
        // 月度加工情况统计钻取分页
        handleMonthProcessChartDetailCurrentChange() { newPage },
        // 对话框关闭
        dialogClosed() {
          this.activeName = 'stepInfo';
        },
        // 批次加工进度节点点击事件
        nodeClick(row, index) {
          const { containername, containerid, workflowstepname, workflowstepid, stepinfoid, description, stepno } = row.steps[index];
          this.detail.title = `批次：【${containername}】-- 工步:【${description}】 详细信息`;
          this.detail.dialogVisiable = true;
          this.detail.selecteSpecInfo = { ...row };
          this.detail.queryInfo = { containerid, workflowstepid, stepinfoid };

          this.getStepInfo();//工步加工信息
        },
        // tab选项卡变更事件
        tabSelectChange(tab, event) {
          const { label, paneName } = tab;
          switch (paneName) {
            case "checkPointResultInfo":
              this.getCheckPointResultInfo();//检测项
              break;
            case "stepInfo":
              this.getStepInfo();//工步加工信息
              break;
            default:
              break;
          }
        },
        // 工步加工信息
        async getStepInfo() {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { containerid, workflowstepid, stepinfoid } = this.detail.queryInfo;
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: `${this.baseApi}?action=getStepInfo`,
            data: { type: 'getStepInfo', containerid, workflowstepid, stepinfoid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.detail.stepInfoList = data;
        },
        // 检测项
        async getCheckPointResultInfo() {
          this.loading = true;
          this.loadingText = "数据加载中...";
          const { containerid, workflowstepid, stepinfoid } = this.detail.queryInfo;
          const { data: { data, meta, total } } = await axios({
            method: 'POST',
            url: `${this.baseApi}?action=getCheckPointResultInfo`,
            data: { type: 'getCheckPointResultInfo', containerid, workflowstepid, stepinfoid }
          });
          this.loading = false;
          if (meta.status === 500) { return this.$message.error(meta.msg); }
          this.detail.checkPointResultInfoList = data;
        },
        selectYearMonthChange(val) {
          if (val) {
            this.queryInfo.startOfSelectMonth = dayjs(this.queryInfo.yearmonth).startOf('month').format('YYYY-MM-DD');
            this.queryInfo.endOfSelectMonth = dayjs(this.queryInfo.yearmonth).endOf('month').format('YYYY-MM-DD');
          }
        },
        // 查询按钮
        handleBtnSearch() {
          this.$refs['queryInfoRef'].validate(async (valid) => {
            if (valid) {
              this.queryInfo.currentPage = 1;
              this.getStepProcessInfo();//批次加工进度
              this.getShipRateData();//转工管理
              this.getApsRateData();//排产管理
              this.getFeedbackRateData();//问题快反
              this.getPhyRateData();//理化管理
              this.getMonthProcessData();//月度加工情况统计
            }
          })
        },
      },
      async mounted() {
        window.addEventListener('resize', () => {
          this.chartHeight = window.innerHeight - 740;
        });
        this.queryInfo.yearmonth = dayjs().format('YYYY-MM');
        this.queryInfo.startOfSelectMonth = dayjs(this.queryInfo.yearmonth).startOf('month').format('YYYY-MM-DD');
        this.queryInfo.endOfSelectMonth = dayjs(this.queryInfo.yearmonth).endOf('month').format('YYYY-MM-DD');

        this.orginazition = await getMESOrginazition({ isMapping: '是', factoryCode: '602' });
        this.queryInfo.selectOrg = [this.orginazition[0].value];

        this.handleBtnSearch();
      }
    })
  </script>
</body>

</html>